import React from 'react';
import './App.css';
import {connect} from 'react-redux'
import { HashRouter as Router, Route,Switch } from 'react-router-dom'
import Login from './view/Login/Login'
import MainPage from './view/MainPage/MainPage'
import ProductDetail from './view/ProductDetail/ProductDetail'
import StaffSelect from './components/CateList/StaffSelect'
import GoodPro from './components/Topic/GoodPro'
import Search from './components/Search/Search'


class App extends React.Component {
  componentDidMount(){
    let CartList=JSON.parse(window.localStorage.getItem('CartList'))||[]
    this.props.changeProductReducer(['CartList'], CartList)
  }

  render() {
    return (
      <div className="App">
        <Router>
        <Switch>
          <Route path="/StaffSelect"   component={StaffSelect}></Route>
          <Route path="/Login"   component={Login}></Route>
          <Route path="/ProductDetail" component={ProductDetail}></Route>
          <Route path="/GoodPro" component={GoodPro}></Route>
          <Route path='/Search' component={Search}></Route>
          <Route path="/" component={MainPage}></Route>
        </Switch>
        </Router>
        </div>   
    )
  }
}
const mapStateToProps = (state) => {
  return {
    productInfo: state.getIn(['productReducer', 'productInfo']),
    CartList: state.getIn(['productReducer', 'CartList'])
  }
}
const mapDispatchToProps = (dispatch) => {
  return {
    changeProductReducer: (arr, val) => {
      let action = (arr, val) => {
        return {
          type: 'UPDATE_PRODUCT_DETAIL',
          payload: {
            keyArr: arr,
            val: val,
          },
        }
      }
      dispatch(action(arr, val))
    },
  }
}
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(App)
